import { RouteRecordRaw, Router, RouterOptions, createRouter, createWebHistory } from "vue-router"
//由于router的API默认使用了类型进行初始化，内部包含类型定义，所以本文内部代码中的所有数据类型是可以省略的
//RouterRecordRaw是路由组件对象
// const routes: Array<RouteRecordRaw> = [
const routes: RouteRecordRaw[] = [
  {
    path: "/",
    name: "Home",
    component: () => import("@/layout/index.vue"),
    redirect: "/Basic",
    children: [
      {
        path: "Basic",
        name: "Basic",
        component: () => import("@/views/basic/index.vue"),
        redirect: "/Basic/MyButton",
        children: [
          {
            path: "MyButton",
            name: "MyButton",
            component: () => import("@/views/basic/components/MyButton.vue"),
          },
          {
            path: "MyBorder",
            name: "MyBorder",
            component: () => import("@/views/basic/components/MyBorder.vue"),
          },
        ]
      },
      {
        path: "Form",
        name: "Form",
        component: () => import("@/views/form/index.vue"),
        redirect: "/Form/MyCheckbox",
        children: [
          {
            path: "MyCheckbox",
            name: "MyCheckbox",
            component: () => import("@/views/form/components/MyCheckbox.vue"),
          },
        ]
      },
      {
        path: "ProjectList",
        name: "ProjectList",
        component: () => import("@/views/project/ProjectList.vue"),
      },
      {
        path: "pinia",
        name: "Pinia",
        component: () => import("@/views/Pinia/index.vue"),
      },
      {
        path: "wangeditor",
        name: "Wangeditor",
        component: () => import("@/views/Wangeditor/index.vue"),
      },
      {
        path: "tableSortable",
        name: "TableSortable",
        component: () => import("@/views/tableSortable/index.vue"),
      },
      {
        path: "treeDrag",
        name: "TreeDrag",
        component: () => import("@/views/treeDrag/index.vue"),
      },
      {
        path: "ganttElastic",
        component: () => import("@/views/GanttElastic/index.vue"),
      },
      {
        path: "Square",
        component: () => import("@/views/Square/index.vue"),
      },
      {
        path: "AutoComplete",
        component: () => import("@/views/Wangeditor/AutoComplete.vue"),
      },
      {
        path: "WangEditorForVue3",
        component: () => import("@/views/Wangeditor/WangEditorForVue3.vue"),
      },
      {
        path: "RelationGraph",
        component: () => import("@/views/RelationGraph/index.vue"),
      },
      {
        path: "Websocket",
        component: () => import("@/views/Websocket/index.vue"),
      },
      {
        path: "ExpandTable",
        component: () => import("@/views/table/ExpandTable.vue"),
      },
      {
        path: "VueGridLayout",
        component: () => import("@/views/VueGridLayout/index.vue"),
      },
      {
        path: "Scroll",
        component: () => import("@/views/Scroll/index.vue"),
      },
      {
        path: "Resize",
        component: () => import("@/views/Resize/index.vue"),
      },
      {
        path: "VxeTable",
        component: () => import("@/views/VxeTable/index.vue"),
      },
    ]
  },
];

// RouterOptions是路由选项类型
const options: RouterOptions = {
  // 采用hash 模式
  // history: createWebHashHistory(),
  // 采用 history 模式
  history: createWebHistory(),
  routes,
}

// Router是路由对象类型
const router: Router = createRouter(options)

export default router